<template>
  <Modal v-model="modal" :title="title">
    <div class="ht400 scroll">
      <Form :label-width="80">
        <Row class="pr">
          <Col span="24">
            <FormItem label="经销商">
              {{distributor.distributorName}}
            </FormItem>
          </Col>
        </Row>
        <Row class="pr">
          <Col span="24">
            <FormItem label="维护人">
              <SelectList @input="onChange" listType='selfList' :selfList='list' />
            </FormItem>
          </Col>
        </Row>
      </Form>
    </div>
    <div slot="footer">
        <Button @click="modal = false" size="large" type="text">取消</Button>
        <Button @click="onSave" type="primary" size="large">确认</Button>
    </div>
</Modal>
</template>
<script>
import AreaSelect from "~/AreaSelect";
import SelectList from "~/SelectList";
export default {
  data() {
    return {
      id: null,
      modal: false,
      title: '更改维护人',
      currValue: '',
      loading: false,
      list: [],
      distributor: {},
      selectedRole: {}
    };
  },
  components: {
    SelectList
  },
  methods: {
    onSave() {
      this.$emit('confirm', this.selectedRole)
      this.closeModal()
    },
    onChange(v) {
      const item = this.list.find(item => item.id == v)
      this.selectedRole = item
    },
    getRoleList(params) {
      this.$ajaxGet('/distributor_salesman/listSalesman', params).then(res => {
        let arr = []
        res.forEach(item => {
          item.value = item.id
          item.text = item.realname
          if (!arr.find(a => a.id === item.id)) {
            arr.push({ ...item })
          }
        })
        this.list = arr
      })
    },
    openModal(params) {
      this.modal = true;
      this.list = []
      this.selectedRole = {}
      this.distributor = params
      this.getRoleList({distributorId:params.distributorId})
    },
    closeModal() {
      this.modal = false;
    },
     
  }
}
</script>
